<template>
  <div>
    <div class="step">
      <step :cur="recommendCurStep" :step="recommendStep"></step>
    </div>
    <div class="content">
      <transition>
        <keep-alive>
          <router-view></router-view>
        </keep-alive>
      </transition>
        <!-- <questions v-show="recommendCurStep == 0"></questions>
        <amount v-show="recommendCurStep == 1"></amount>
        <recommend v-show="recommendCurStep == 2"></recommend>
        <backtest v-show="recommendCurStep == 3"></backtest> -->
    </div>
  </div>
</template>

<script>
import step from './components/step'
import Questions from './components/questions.vue'
import amount from './components/amount.vue'
import recommend from './components/recommend.vue'
import backtest from './components/backtest.vue'
import {mapState, mapActions} from 'vuex'
  let map = {
      '0': '/risk',
      '1': '/amount',
      '2': '/recommend',
      '3': '/backtest'
    }


export default {
  components:{step,Questions,amount,recommend, backtest},
  data() {
    return {
      cur:2,
      step:0,
    }
  },
  computed:{
    // ...mapState({risk_res,total_assets,recommendStep,recommendCurStep})

    ...mapState(['risk_res','total_assets','recommendStep']),
    recommendCurStep () {
      let cur = this.$store.state.recommendCurStep
      this.$router.replace(map[cur])
      return cur
    }
  },
  watch:{
    recomendCurStep(newVal, oldVal) {
      this.$router.replace(map[newVal])
    }
  },
  created(){
    let _this = this
    this.$store.commit('setAccount_id',window.localStorage.account_id)
    this.get_account_info()
    .then (res => {
    
      console.log(res)
    _this.$router.replace(map[res])
    })
    

    // this.$router.push(map[this.recommendCurStep])
    // if ([undefined, ''].includes(window.localStorage.risk_res)) {
    //   this.cur = this.step = 0
    // } else {
    //   if ([undefined, '', 0, '0'].includes(window.localStorage.total_assets)) {
    //     this.cur = this.step = 1
    //   } else {
    //     this.cur = this.step = 2
    //   }
    // }
    
  },
  methods:{
    ...mapActions(['get_account_info']),
   
  }

    
}
</script>

<style scoped>
.step{
  /* position: fixed;
  top: 0;
  right: 0; */
}
.content{
  margin: 40px 20px;
  padding: 20px;
}

</style>